:root {
  --background-color: rgba(93, 72, 182, 1);
  --navigation-container-color: #f0f0f0;
  --current-color: grey;
  --current-bg-color: grey;
}

body {
  transition: all 0.5s ease;
  animation: open 1s ease-in;
  @keyframes open {
    0% {
      bottom: center;
      left: center;
      clip-path: circle(0 at center);
    }
    100% {
      bottom: calc(100% + 1rem);
      left: calc(100% + 1rem);
      width: 100%;
      height: 100%;
      clip-path: circle(100% at center);
    }
  }
}

// button:active {
//   transform: translateY(2px);
//   box-shadow: 0 0 0 3px rgba(72, 138, 182, 0.3);
//   animation: pulse 1s;

//   @keyframes pulse {
//     0% {
//       box-shadow: 0 0 0 0 rgba(72, 138, 182, 1);
//     }
//   }
// }
